﻿
@{
    ViewBag.Title = "Form";
    Layout = "~/Views/Shared/_Index.cshtml";
}

<style>
    .form .formValue input.form-control {
        height: 34px;
        line-height: 34px;
    }

    .form-control {
        padding: 0px;
    }

    .autocomplete-suggestions {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        border: 1px solid #999;
        background: #FFF;
        cursor: default;
        overflow: auto;
        -webkit-box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64);
        -moz-box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64);
        box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64);
    }

    .autocomplete-selected {
        background: #F0F0F0;
    }

    .autocomplete-suggestion {
        padding: 2px 5px;
        white-space: nowrap;
        overflow: hidden;
    }

    .autocomplete-no-suggestion {
        padding: 2px 5px;
    }

    ul {
        list-style: none;
        float: left;
        -webkit-padding-start: 10px;
    }

        ul li {
            list-style-type: none;
            float: left;
        }

    .active {
        border: 1px solid #1ABC9C;
    }

        .active:hover {
            background-color: #1ABC9C;
            color: #fff;
            text-decoration: none;
        }

    a {
        padding: 3px 10px;
    }

        a:hover {
            border: 1px solid #1ABC9C;
            text-decoration: none;
        }
    .zdyGirdPanel .active {
        border:0px;
    }
    .zdyGirdPanel .active:hover {
        background-color:none;
        color: rgb(71, 80, 89);
    }

    .zdyUL {
        list-style-type: none;
        margin: 5px 0px 0px -3px;
        padding: 0px;
    }

        .zdyUL li {
            float: left;
            list-style: none;
            height: 24px;
            line-height: 22px;
        }

        .zdyUL li a {
            cursor: pointer;
            padding: 5px 10px;
            border-radius: 4px;
        }

        .zdyUL li i {
            margin-right: 4px;
            font-size: 13px;
            color: #666;
            vertical-align: middle;
            margin-top: -1px;
        }

        .zdyUL li a:hover {
            text-decoration: none;
            background-color: #1ABC9C;
            color: #fff;
      }
</style>
<script>
    var resultData = {};    
    var F_ClientId = $.request("F_ClientId");
    var F_UserId = $.request("F_UserId");
    $(function () {
        GetItems();   
        GetClientEntity();
        GetProjectInfos();
    });

    function btn_Add(obj) {
        var strParam = obj.id;
        var F_ClientId = strParam.split('&')[0];
        var F_BrandId = strParam.split('&')[1];
        var F_ProjectId = strParam.split('&')[2];
        var F_ContactId = strParam.split('&')[3];
        $.modalOpen({
            id: "projectAdd",
            title: "新建品牌组需求",
            url: "/ClientManager/ClientInfos/AddMemand?F_ClientId=" + F_ClientId + "&F_BrandId=" + F_BrandId + "&F_ProjectId=" + F_ProjectId + "&F_ContactId=" + F_ContactId +"",
            width: "1200px",
            height: "650px",
            callBack: function (iframeId) {
                top.frames[iframeId].submitForm();
            }
        });
    }

    function GetProjectInfos() {
        var $gridList = $("#gridListqq");
        $gridList.dataGrid({
            url: "/ClientManager/ClientInfos/GetProjectInfoList",
            postData: { F_ClientId: F_ClientId, F_UserId: F_UserId },
            height: 300,
            colModel: [
                {
                    label: '操作', name: '', align: 'left', width: 80, formatter: function (cellvalue, options, rowObject) {
                        if (rowObject["contactId"] == undefined) {
                            return '<span style=\'color:red;\'>资料不完整</span>';
                        } else {
                            return "<ul class=\"zdyUL\" style=\"white-space:nowrap;\"><li><a id=\"" + rowObject["F_ClientId"] + '&' + rowObject["F_BrandId"] + '&' + rowObject["F_ProjectId"] + '&' + rowObject["contactId"] + "\" authorize=\"yes\" onclick=\"btn_Add(this)\"><i class=\"fa fa-plus\"></i>新建需求</a></li></ul>";
                        }                        
                    }
                },
                { label: '品牌', name: 'F_BrandName', align: 'left', width: 80 },
                { label: '项目组', name: 'F_ProjectName', align: 'left', width: 80 },
                { label: '联系人', name: 'F_Contact', align: 'left', width: 80},                
                { label: '手机号码', name: 'F_Phone', width: 80, align: 'left' },                
                { label: '邮箱', name: 'F_Mail', width: 120, align: 'left' },               
                { label: '活动主题', name: 'F_ActivityTheme', align: 'left' },
                {
                    label: '活动类型', name: 'F_ActivityType', width: 80, align: 'left', formatter: function (cellvalue) {
                        return GetDictionaries(cellvalue, 'F_ActivityType');
                    }
                },
                { label: '预算金额', name: 'F_DemandCash', width: 80, align: 'left' },
                { label: '搭建日期', name: 'F_BuildDate', align: 'left' },
                { label: '活动开始日期', name: 'F_ActivityStartDate', align: 'left' },
                { label: '活动结束日期', name: 'F_ActivityEndDate', align: 'left' },
                {
                    label: '活动城市', name: 'F_ActivityCityId', width: 80, align: 'left', formatter: function (cellvalue) {
                        return GetDictionaries(cellvalue, 'F_ActivityCityId');
                    }
                },               
                {
                    label: '场地类型', name: 'F_SiteType', width: 80, align: 'left', formatter: function (cellvalue) {
                        return GetDictionaries(cellvalue, 'F_SiteType');
                    }
                },
                { label: '场地面积', name: 'F_SiteArea', width: 80, align: 'left' },                
                { label: '', name: 'F_Id', hidden: true },
                { label: '', name: 'F_ClientId', hidden: true },
                { label: '', name: 'DemandId', hidden: true },
                { label: '', name: 'F_BrandId', hidden: true },
                { label: '', name: 'contactId', hidden: true },
                { label: '', name: 'F_ProjectId', hidden: true },
            ],
            pager: "#gridPagerqq",
            viewrecords: true,
            multiselect: false,
            sortname: 'F_Id',
            rowNum: 10,
            rowList: [10, 20],
            ondblClickRow: function (rowid, iRow, iCol, e) {                
                detial();
            },
            loadComplete: function (data) {
            }
        });
    }

    function detial() {
        var rowobj = $("#gridListqq").jqGridRowValue();
        $.modalOpen({
            id: "editDemandForm2",
            title: "品牌组需求",
            url: "/ClientManager/ClientInfos/EditDemandForm?DemandId=" + rowobj.DemandId + "&F_ClientId=" + rowobj.F_ClientId + "&F_ClientType=" + rowobj.F_ClientType + "&F_ClientName=" + F_ClientName +"",
            width: "1200px",
            height: "650px",
            callBack: function (iframeId) {
                top.frames[iframeId].submitForm();
            }
        });
    }

    function submitForm() {
        if (!$('#companyForm').formValid()) {
            return false;
        }
        var F_ClientType = $("#F_ClientType").val();
        var F_ClientName = $("#F_ClientName").val();
        var F_CompanyType = $("#F_CompanyType").val();
        var F_ClientLevel = $("#F_ClientLevel").val();
        var F_CityId = $("#F_CityId").val();
        var F_AreaId = $("#F_AreaId").val();
        var F_Address = $("#F_Address").val();
        var F_IndustryId = $("#F_IndustryId").val();
        $.submitForm({
            url: "/ClientManager/ClientInfos/SubmitCompanyForm",
            param: {
                F_ClientId: F_ClientId, F_ClientType: F_ClientType, F_ClientName: F_ClientName, F_CompanyType: F_CompanyType, F_ClientLevel: F_ClientLevel,
                F_CityId: F_CityId, F_AreaId: F_AreaId, F_Address: F_Address, F_IndustryId: F_IndustryId
            },
            success: function () {
                $.currentWindow().$("#gridList").trigger("reloadGrid");
            }
        });
    }

    function GetDictionaries(value, type) {
        if (type == "F_DepartmentId") {
            for (var i = 0; i < resultData.F_DepartmentId.length; i++) {
                if (value == resultData.F_DepartmentId[i].F_ItemCode) {
                    return resultData.F_DepartmentId[i].F_ItemName;
                }
            }
            return '';

        } else if (type == "F_PositionId") {
            for (var i = 0; i < resultData.F_PositionId.length; i++) {
                if (value == resultData.F_PositionId[i].F_ItemCode) {
                    return resultData.F_PositionId[i].F_ItemName;
                }
            }
            return '';
        }
        else if (type == "F_ActivityCityId") {
            var strHtml = "";
            for (var i = 0; i < resultData.F_CityId.length; i++) {
                for (var j = 0; j < value.split(',').length; j++) {
                    if (j == value.split(',').length - 1) {
                        if (value.split(',')[j] == resultData.F_CityId[i].F_EnCode) {
                            strHtml += resultData.F_CityId[i].F_FullName;
                        }
                    } else {
                        if (value.split(',')[j] == resultData.F_CityId[i].F_EnCode) {
                            strHtml += resultData.F_CityId[i].F_FullName + ",";
                        }
                    }
                }
            }
            return strHtml; 
        }
        else if (type == "F_ActivityType") {
            for (var i = 0; i < resultData.F_ActivityType.length; i++) {
                if (value == resultData.F_ActivityType[i].F_ItemCode) {
                    return resultData.F_ActivityType[i].F_ItemName;
                }
            }
            return '';
        } else if (type == "F_SiteType") {
            for (var i = 0; i < resultData.F_SiteType.length; i++) {
                if (value == resultData.F_SiteType[i].F_ItemCode) {
                    return resultData.F_SiteType[i].F_ItemName;
                }
            }
            return '';
        }
    }

    function GetClientEntity() {
        $.ajax({
            url: "/ClientManager/ClientInfos/GetClientEntity?F_ClientId=" + F_ClientId +"",
            dataType: "json",
            async: false,
            success: function (data) {
                $("#F_ClientType").val(data["F_ClientType"]);
                $("#F_ClientName").val(data["F_ClientName"]);
                $("#F_CompanyType").val(data["F_CompanyType"]);
                $("#F_ClientLevel").val(data["F_ClientLevel"]);
                if (data["F_CityId"] != null) {
                    $("#F_CityId").val(data["F_CityId"].split(',')).trigger('change');
                }
                
                $("#F_AreaId").val(data["F_AreaId"]);
                $("#F_Address").val(data["F_Address"]);
                $("#F_IndustryId").val(data["F_IndustryId"]);
                if (data["F_ClientType"] == "1") {
                    $("#F_IndustryId").removeAttr("disabled");
                    $("#F_IndustryId").css("background-color", "#fff");
                } else if (data["F_ClientType"] == "2") {
                    $("#F_IndustryId").attr("disabled", "disabled");
                    $("#F_IndustryId").css("background-color", "#ddd");
                }
            }, error: function (XMLHttpRequest, textStatus, errorThrown) {
            }
        });
    }

    function ChangeClientType() {
        var F_ClientType = $("#F_ClientType").val();
        if (F_ClientType == "1") {
            $("#F_CompanyType").attr("disabled", "disabled");
            $("#F_CompanyType").css("background-color", "#ddd");            
            $("#F_IndustryId").removeAttr("disabled");
            $("#F_IndustryId").css("background-color", "#fff");


        } else {
            $("#F_IndustryId").attr("disabled", "disabled");
            $("#F_IndustryId").css("background-color", "#ddd");

            $("#F_CompanyType").removeAttr("disabled");
            $("#F_CompanyType").css("background-color", "#fff");         
        }
    }

    function ChangeCityData() {
        var id = $("#F_CityId").val();
        $("#F_AreaId").empty();
        var F_AreaId = resultData.F_AreaId;
        for (var i = 0; i < F_AreaId.length; i++) {
            if (F_AreaId[i].F_ParentId == id) {
                $("#F_AreaId").append("<option value='" + F_AreaId[i].F_EnCode + "'>" + F_AreaId[i].F_FullName + "</option>");
            }
        }
    }

    function InitControl() {
        var F_ClientType = resultData.F_ClientType;
        for (var i = 0; i < F_ClientType.length; i++) {
            $("#F_ClientType").append("<option value='" + F_ClientType[i].F_ItemCode + "'>" + F_ClientType[i].F_ItemName + "</option>");
        }

        var F_CompanyType = resultData.F_CompanyType;
        for (var i = 0; i < F_CompanyType.length; i++) {
            $("#F_CompanyType").append("<option value='" + F_CompanyType[i].F_ItemCode + "'>" + F_CompanyType[i].F_ItemName + "</option>");
        }

        var F_ClientLevel = resultData.F_ClientLevel;
        for (var i = 0; i < F_ClientLevel.length; i++) {
            $("#F_ClientLevel").append("<option value='" + F_ClientLevel[i].F_ItemCode + "'>" + F_ClientLevel[i].F_ItemName + "</option>");
        }

        var F_IndustryId = resultData.F_IndustryId;
        for (var i = 0; i < F_IndustryId.length; i++) {
            $("#F_IndustryId").append("<option value='" + F_IndustryId[i].F_ItemCode + "'>" + F_IndustryId[i].F_ItemName + "</option>");
        }

        var F_DepartmentId = resultData.F_DepartmentId;
        for (var i = 0; i < F_DepartmentId.length; i++) {
            $("#F_DepartmentId").append("<option value='" + F_DepartmentId[i].F_ItemCode + "'>" + F_DepartmentId[i].F_ItemName + "</option>");
        }

        var F_PositionId = resultData.F_PositionId;
        for (var i = 0; i < F_PositionId.length; i++) {
            $("#F_PositionId").append("<option value='" + F_PositionId[i].F_ItemCode + "'>" + F_PositionId[i].F_ItemName + "</option>");
        }

        //var F_CityId = resultData.F_CityId;
        //for (var i = 0; i < F_CityId.length; i++) {
        //    $("#F_CityId").append("<option value='" + F_CityId[i].F_EnCode + "'>" + F_CityId[i].F_FullName + "</option>");
        //}
        $("#F_CityId").bindSelect({
            url: "/ClientManager/ClientInfos/GetAllCitys",
            search: true,            
            id: "F_EnCode",
            text: "F_FullName"
        });

        var F_AreaId = resultData.F_AreaId;
        for (var i = 0; i < F_AreaId.length; i++) {
            $("#F_AreaId").append("<option value='" + F_AreaId[i].F_EnCode + "'>" + F_AreaId[i].F_FullName + "</option>");
        }
    }
    
    function GetItems() {
        resultData = getCache("CLIENT_EDITFORM");
        if (!resultData || resultData.length <= 0) {
            $.ajax({
                url: "/ClientManager/ClientInfos/GetItemListJson",
                dataType: "json",
                async: false,
                success: function (data) {
                    resultData = data;
                    InitControl();
                    setCache("CLIENT_EDITFORM", data);
                }, error: function (XMLHttpRequest, textStatus, errorThrown) {
                }
            });
        } else {
            InitControl();
        }
    }

    function btn_AddProject() {
        var F_ClientType = $("#F_ClientType").val();
        $.modalOpen({
            id: "projectAdd",
            title: "新建品牌项目组",
            url: "/ClientManager/ClientInfos/AddProject?F_ClientType=" + F_ClientType + "&F_ClientId=" + F_ClientId + "",
            width: "1200px",
            height: "650px",
            callBack: function (iframeId) {
                top.frames[iframeId].submitForm();
            }
        });
    }
</script>
<div id="mainForm">
    <div id="companyInfos">
        <form id="companyForm">
            <table class="form">                
                <tr>
                    <td colspan="6" class="interval">公司基本资料</td>
                </tr>
                <tr>
                    <td colspan="6">
                        <table class="form">
                            <tr>
                                <td class="formTitle">客户类型</td>
                                <td class="formValue">
                                    <select id="F_ClientType" name="F_ClientType" class="form-control required" onchange="ChangeClientType()">
                                        <option value="">==请选择客户类型==</option>
                                    </select>
                                </td>
                                <td class="formTitle">客户名称</td>
                                <td class="formValue">
                                    <div class="input-group" style="width:100%;">
                                        <input type="text" id="F_ClientName" class="form-control required" placeholder="请输入客户名称" />
                                    </div>
                                </td>
                                <td class="formTitle">客户等级</td>
                                <td class="formValue">
                                    <select id="F_ClientLevel" name="F_ClientLevel" class="form-control required">
                                        <option value="">==请选择客户等级==</option>
                                    </select>
                                </td>
                            </tr>
                            <tr>                                
                                <td class="formTitle">所在城市</td>
                                <td class="formValue">
                                    <select id="F_CityId" name="F_CityId" class="form-control required" onchange="ChangeCityData()">
                                        <option value="">==请选择城市==</option>
                                    </select>
                                </td>
                                <td class="formTitle">行政区域</td>
                                <td class="formValue">
                                    <select id="F_AreaId" name="F_AreaId" class="form-control required">
                                        <option value="">==请选择行政区域==</option>
                                    </select>
                                </td>
                                <td class="formTitle">公司地址</td>
                                <td class="formValue">
                                    <input type="text" id="F_Address" class="form-control" placeholder="请输入公司地址" />
                                </td>
                            </tr>
                            <tr>                                
                                <td class="formTitle">所属行业</td>
                                <td class="formValue">
                                    <select id="F_IndustryId" name="F_IndustryId" class="form-control">
                                        <option value="">==请选择行业==</option>
                                    </select>
                                </td>
                                <td class="formTitle"></td>
                                <td class="formValue"></td>
                                <td class="formTitle"></td>
                                <td class="formValue"></td>
                            </tr>
                        </table>
                    </td>
                </tr>                
                <tr>
                    <td colspan="6" class="interval">客户品牌需求表</td>
                </tr> 
                <tr>
                    <td colspan="6">
                        <div style="float:right;margin-top:3px;margin-bottom:3px;margin-right:3px;">
                            <div class="btn-group">
                                <a class="btn btn-primary" onclick="btn_AddProject()"><i class="fa fa-eraser">新建品牌项目组</i></a>
                            </div>                           
                        </div>
                    </td>
                </tr>
            </table>
            <div class="zdyGirdPanel">
                <table id="gridListqq"></table>
                <div id="gridPagerqq"></div>
            </div>
        </form>
    </div>    
</div>

